/**
 * @file router 配置
 * @author 赵思源 <9946726+zsyaa@user.noreply.gitee.com>
 */

import Vue from 'vue'
import VueRouter from 'vue-router'

import store from '@/store'
import http from '@/api'
import preload from '@/common/preload'

Vue.use(VueRouter)

// const Login = () => import(/* webpackChunkName: 'login' */'@/views/login.vue')// 登录的页面
const Register = () => import(/* webpackChunkName: 'register' */'@/views/register.vue')// 注册

// const CuHome = () => import(/* webpackChunkName: 'chome' */'@/views/customer/chome.vue')// 主页面
const CuHome1 = () => import(/* webpackChunkName: 'chome' */'@/views/customer/newhome.vue')// 主页面
const CuOrdering = () => import(/* webpackChunkName: 'allunderway' */'@/views/customer/allunderway.vue')// 正在进行订单的页面
const CuUnderway = () => import(/* webpackChunkName: 'cunderway' */'@/views/customer/cunderway.vue')// 正在进行订单的页面
const CuInfo = () => import(/* webpackChunkName: 'cselfinfo' */'@/views/customer/cselfinfo.vue')// 个人资料的页面
const CuPast = () => import(/* webpackChunkName: 'chistoryorder' */'@/views/customer/chistoryorder.vue')// 历史订单的页面
const Cushowmerchant = () => import(/* webpackChunkName: 'showmerchant' */'@/views/customer/showmerchant.vue')// 展示商户信息的页面
const Cuchosemerchant = () => import(/* webpackChunkName: 'showmerchant' */'@/views/customer/chosemerchant.vue')// 选择商户的页面

const MainEntry = () => import(/* webpackChunkName: 'homepage' */'@/homepage.vue')

const MeHome = () => import(/* webpackChunkName: 'mhome' */'@/views/merchant/mhome.vue')
const MeOrder = () => import(/* webpackChunkName: 'order' */'@/views/merchant/order.vue')
const MePrice = () => import(/* webpackChunkName: 'mshowprice' */'@/views/merchant/mshowprice.vue')
const MeOrderInfo = () => import(/* webpackChunkName: 'orderinfo' */'@/views/merchant/orderinfo.vue')
const MeAddPrice = () => import(/* webpackChunkName: 'maddprice' */'@/views/merchant/maddprice.vue')
const MeSavePrice = () => import(/* webpackChunkName: 'msaveprice' */'@/views/merchant/msaveprice.vue')
const MeInfo = () => import(/* webpackChunkName: 'mselfinfo' */'@/views/merchant/mselfinfo.vue')// 个人资料的页面
const MeIncome = () => import(/* webpackChunkName: 'mincome' */'@/views/merchant/mincome.vue')//
const MeStatis = () => import(/* webpackChunkName: 'statis' */'@/views/merchant/statis.vue')//
const NotFound = () => import(/* webpackChunkName: 'none' */'@/views/404')
const routes = [
    {
        path: '/',
        name: 'appMain',
        component: MainEntry,
        meta: {
            keepAlive: false,
            requireLogin: false
        }
    },
    {
        path: '/register',
        name: 'register',
        component: Register,
        meta: {
            keepAlive: false,
            requireLogin: false
        }
    },
    {
        path: '/chosemerchant',
        name: 'cuchosemerchant',
        component: Cuchosemerchant,
        meta: {
            keepAlive: true,
            requireLogin: true,
            customer: true
        }
    },
    {
        path: '/cuhome',
        name: 'cuhome',
        component: CuHome1,
        meta: {
            keepAlive: true,
            requireLogin: true,
            customer: true
        }
    },
    {
        path: '/underway',
        name: 'underway',
        component: CuUnderway,
        meta: {
            keepAlive: true,
            requireLogin: true,
            customer: true
        }
    },
    {
        path: '/ordering',
        name: 'ordering',
        component: CuOrdering,
        meta: {
            keepAlive: true,
            requireLogin: true,
            customer: true
        }
    },
    {
        path: '/selfinfo',
        name: 'selfinfo',
        component: CuInfo,
        meta: {
            keepAlive: true,
            requireLogin: true,
            customer: true
        }
    },
    {
        path: '/past',
        name: 'past',
        component: CuPast,
        meta: {
            keepAlive: true,
            requireLogin: true,
            customer: true
        }
    },
    {
        path: '/showmerchant',
        name: 'cushowmerchant',
        component: Cushowmerchant,
        meta: {
            keepAlive: true,
            requireLogin: true,
            customer: true
        }
    },
    {
        path: '/mehome',
        name: 'mehome',
        component: MeHome,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/meorder',
        name: 'meorder',
        component: MeOrder,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/meprice',
        name: 'meprice',
        component: MePrice,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/meorderinfo',
        name: 'meorderinfo',
        component: MeOrderInfo,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/meaddprice',
        name: 'meaddprice',
        component: MeAddPrice,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/mesaveprice',
        name: 'mesaveprice',
        component: MeSavePrice,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/meinfo',
        name: 'meinfo',
        component: MeInfo,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/income',
        name: 'meincome',
        component: MeIncome,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    {
        path: '/statis',
        name: 'mestatis',
        component: MeStatis,
        meta: {
            keepAlive: true,
            requireLogin: true,
            merchant: true
        }
    },
    // 404
    {
        path: '*',
        name: '404',
        component: NotFound
    }
]

const router = new VueRouter({
    // mode: 'history',
    routes: routes
})

const cancelRequest = async () => {
    const allRequest = http.queue.get()
    const requestQueue = allRequest.filter(request => request.cancelWhenRouteChange)
    await http.cancel(requestQueue.map(request => request.requestId))
}

let preloading = true
let canceling = true
let pageMethodExecuting = true

router.beforeEach(async (to, from, next) => {
    canceling = true
    await cancelRequest()
    canceling = false
    next()
})

router.afterEach(async (to, from) => {
    store.commit('setMainContentLoading', true)

    preloading = true
    await preload()
    preloading = false

    const pageDataMethods = []
    const routerList = to.matched
    routerList.forEach(r => {
        Object.values(r.instances).forEach(vm => {
            if (typeof vm.fetchPageData === 'function') {
                pageDataMethods.push(vm.fetchPageData())
            }
            if (typeof vm.$options.preload === 'function') {
                pageDataMethods.push(vm.$options.preload.call(vm))
            }
        })
    })

    pageMethodExecuting = true
    await Promise.all(pageDataMethods)
    pageMethodExecuting = false

    if (!preloading && !canceling && !pageMethodExecuting) {
        store.commit('setMainContentLoading', false)
    }
})

export default router
